<!--
  发货组件: 查询到已支付的订单,点击发货按钮,订单状态从1改为2
-->
<script>
export default {
  name: "GoodsOut",
  data() {
    return {
      tableData: [],
    }
  },
  methods: {
    // 点击发货 订单状态从1改为2
    faHuo(row) {
      console.info(row)
      //更改订单状态 为 3 ，跟据订单id
      this.$http.post('/order/updateStatusByOrderId', {orderId: row.orderId, status: 3})
          .then(res => {
            if (res.data.msg === 1) {
              this.findData();
              this.$message.success("发货成功")
            }
            console.info(res)
          })
    },
    findData() {
      this.$http.get('/order/findAllOrder')
          .then(res => {
                const filterOrders = res.data.filter(item => item.orderStatus === 1);
                filterOrders.forEach(item => {
                  item.createTime = item.createTime.replace('.0', '')
                })
                console.log("已支付订单")
                console.info(filterOrders)
                this.tableData = filterOrders
              }
          )
    }
  },
  created() {
    this.findData()
  }
}
</script>

<template>
  <div>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column label="订单编号" prop="orderId" width="80"/>

      <el-table-column label="总金额" prop="allMoney" width="120"/>
      <el-table-column label="订单创建时间" prop="createTime" width="180"/>
      <el-table-column label="收货地址" prop="userAddress" width="220"/>
      <el-table-column label="支付状态" width="120">已支付</el-table-column>
      <el-table-column label="操作" width="180">
        <template #default="scope">
          <el-button size="small" @click="faHuo(scope.row)">
            发货
          </el-button>
        </template>
      </el-table-column>

    </el-table>
  </div>
</template>

<style scoped>

</style>